<script lang="ts">
import { ref } from 'vue'
export default {
  name: 'Cart'
}
</script>
<script setup lang="ts">
//导入生命周期钩子函数
import { ref, onMounted, onUnmounted } from 'vue'

import { useCounterStore } from '../stores/Counter.ts'

let count = ref(1)

const counterStore = useCounterStore()
console.log('count: ', counterStore.username)

//购物车页面
onMounted(() => {
  console.log('onmounted:  购物车页面被挂载了')
})

onUnmounted(() => {
  console.log('onUnmounted:  购物车页面被卸载了')
})
</script>
<template>
  <div>
    <h1>cart123</h1>
    <p>count: {{ counterStore.count }}</p>
    <p>username: {{ counterStore.username }}</p>
    <p>age: {{ counterStore.age }}</p>

    <button @click="counterStore.add">点我改变</button>
  </div>
</template>
<style scope></style>